<!-- ---------我的团队-------- -->
<template>
	<view class="root">
		<view
			:style="{ padding: `30rpx 20rpx`, margin: `20rpx 20rpx 60rpx` }"
			class="bgc-fff fd-row ai-center br-20"
		>
			<image
				class="bgc-eee width-94 height-94 br-circle"
				src="/static/image/mine/avatar.png"
				mode="aspectFill"
			/>
			<view class="ml-18 f1">
				<label>
					<text class="fs-32 fw-700">{{ userInfo.ue_truename || "--" }}</text>
					<text class="fs-24 ml-12 color-f33 fw-600">V{{ userInfo.level }}</text>
				</label>

				<text class="mt-12 fs-24 color-ccc fw-500">
					<text class="mr-10">个人消费</text>
					<text :style="{ color: `#295eea` }">{{ userInfo.xqrs }}</text>
					<text>USDT</text>
				</text>
				<text class="mt-12 fs-24 color-ccc fw-500">
					<text class="mr-10">考核业绩</text>
					<text :style="{ color: `#295eea` }">{{ userInfo.xqyj }}</text>
					<text>USDT</text>
				</text>
			</view>
		</view>

		<view
			v-for="(team, index) in teams"
			:key="index"
			:style="{ margin: `6rpx 20rpx` }"
			class="bgc-fff br-20"
		>
			<view
				:style="{ padding: `30rpx 20rpx` }"
				class="fd-row ai-center"
				@click="showMore(index)"
			>
				<image
					class="bgc-eee width-94 height-94 br-circle"
					:src="team.tx_img || '/static/image/mine/avatar.png'"
					mode="aspectFill"
				/>
				<view class="f1 ml-18">
					<label>
						<text class="fs-32 fw-700">{{ team.ue_truename || team.ue_account }}</text>
						<text class="fs-24 ml-12 color-f33 fw-600">V{{ team.level }}</text>
					</label>

					<text class="mt-12 fs-24 color-ccc fw-500">
						<text class="mr-10">个人消费</text>
						<text :style="{ color: `#295eea` }">{{ team.xqrs }}</text>
						<text>USDT</text>
					</text>
					<text class="mt-12 fs-24 color-ccc fw-500">
						<text class="mr-10">考核业绩</text>
						<text :style="{ color: `#295eea` }">{{ team.xqyj }}</text>
						<text>USDT</text>
					</text>
				</view>

				<text class="fs-28 color-333 fw-500">{{ team.ue_regtime.substr(0, 10) }}</text>
				<uni-icons
					size="20"
					:style="{ transform: `rotate(${team.showMore ? 180 : 0}deg)` }"
					type="arrowdown"
					color="#666"
					class="ml-38"
				/>
			</view>

			<block v-if="team.showMore">
				<view
					v-for="(teamChild, childIndex) in team.son"
					:key="childIndex"
					:style="{ padding: `30rpx 20rpx` }"
					class="bgc-fff fd-row ai-center br-20"
				>
					<image
						class="bgc-eee width-94 height-94 br-circle"
						src="/static/image/mine/avatar.png"
						mode="aspectFill"
					/>
					<view class="f1 ml-18">
						<label>
							<text class="fs-32 fw-700">
								{{ teamChild.ue_truename || team.ue_account }}
							</text>
							<text class="fs-24 ml-12 color-f33 fw-600">V{{ teamChild.level }}</text>
						</label>
						<text class="mt-12 fs-24 color-ccc fw-500">
							<text class="mr-10">个人消费</text>
							<text :style="{ color: `#295eea` }">{{ teamChild.xqrs }}</text>
							<text>USDT</text>
						</text>
						<text class="mt-12 fs-24 color-ccc fw-500">
							<text class="mr-10">考核业绩</text>
							<text :style="{ color: `#295eea` }">{{ teamChild.xqyj }}</text>
							<text>USDT</text>
						</text>
					</view>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				teams: [],
				userInfo: {},
			};
		},
		onLoad() {
			this.$request.get("/Home/info/me").then(({ data }) => {
				this.userInfo = data;
			});
			this.$request.get("/Home/info/myteamdata").then(({ data }) => {
				this.teams = data.map((item) => Object.assign(item, { showMore: false }));
			});
		},
		methods: {
			showMore(index) {
				const { teams } = this;

				teams[index].showMore = !teams[index].showMore;
			},
		},
	};
</script>

<style lang="scss">
	@import "@/static/reset";
</style>
